<template>
  <zm-view ref="view">
    <zm-list ref="list" :options="options" @query="handleQuery">
      <view v-for="item in list" :key="item.id" class="flex items-center justify-between radius-16 mx-24 mt-20 px-24 py-20 bg-white">
        <view class="flex flex-col">
          <text class="font-30 font-bold">{{ item.logName }}</text>
          <text class="text-666 mt-10">{{ item.createTime }}</text>
        </view>
        <text class="font-32 font-bold" :class="{ 'text-price': typeName(item) == '+' }">{{ typeName(item) }}{{ item.money }}</text>
      </view>
    </zm-list>
  </zm-view>
</template>

<script>
import page from "@/mixins/page"
import hook from "@/mixins/hook"
export default {
  mixins: [page, hook],
  data() {
    return {
      list: [],
      options: { emptyText: "暂无记录" }
    }
  },
  computed: {
    typeName() {
      return (item) => {
        switch (item.type) {
          case "1":
            return "+"
          case "2":
            return "-"
        }
      }
    }
  },
  onLoad() {},
  methods: {
    async handleQuery({ type, page, pageSize, fail, success }) {
      try {
        const res = await uni.$api.balance.getConsumeLog({ page, pageSize, type: "0" })
        this.list = type == "load" ? [...this.list, ...res.list] : res.list
        success({ list: res.list, total: res.count })
      } catch (e) {
        fail()
      }
    }
  }
}
</script>

<style lang="scss" scoped></style>
